import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:openim_common/openim_common.dart';
import 'package:qr_flutter/qr_flutter.dart';

import 'group_qrcode_logic.dart';

class GroupQrcodePage extends StatelessWidget {
  final logic = Get.find<GroupQrcodeLogic>();

  GroupQrcodePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Obx(
      () => Scaffold(
        appBar: TitleBar.back(title: StrRes.groupQrcode),
        backgroundColor: Styles.c_F8F9FA,
        body: Container(
          alignment: Alignment.center,
          child: RepaintBoundary(
            key: logic.qrKey,
            child: Container(
              margin: EdgeInsets.symmetric(horizontal: 20.w),
              padding: EdgeInsets.all(30.w),
              width: double.infinity,
              decoration: BoxDecoration(
                color: Styles.c_FFFFFF,
                borderRadius: BorderRadius.circular(10.r),
                boxShadow: [
                  BoxShadow(
                    blurRadius: 7.r,
                    spreadRadius: 1.r,
                    color: Styles.c_000000.withOpacity(.08),
                  ),
                ],
              ),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  // 群头像和群名
                  Container(
                    width: 80.w,
                    height: 80.w,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(8.r),
                      border: Border.all(color: Styles.c_E8EAEF, width: 1.w),
                    ),
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(8.r),
                      child: AvatarView(
                        width: 80.w,
                        height: 80.w,
                        url: logic.groupSetupLogic.groupInfo.value.faceURL,
                        text: logic.groupSetupLogic.groupInfo.value.groupName,
                        textStyle: Styles.ts_FFFFFF_16sp,
                      ),
                    ),
                  ),
                  16.verticalSpace,
                  // 群聊名称
                  Text(
                    '群聊：${logic.groupSetupLogic.groupInfo.value.groupName ?? ''}',
                    style: TextStyle(
                      fontSize: 18.sp,
                      fontWeight: FontWeight.w500,
                      color: Styles.c_0C1C33,
                    ),
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
                  10.verticalSpace,
                  // 二维码
                  Container(
                    width: 260.w,
                    height: 260.w,
                    decoration: BoxDecoration(
                      color: Styles.c_FFFFFF,
                      border: Border.all(color: Styles.c_E8EAEF, width: 1.w),
                      borderRadius: BorderRadius.circular(8.r),
                    ),
                    child: Stack(
                      alignment: Alignment.center,
                      children: [
                        QrImageView(
                          data: logic.buildQRContent(),
                          size: 240.w,
                          backgroundColor: Styles.c_FFFFFF,
                        ),
                        // 中心Paxiy图标
                        Container(
                          width: 40.w,
                          height: 40.w,
                          decoration: BoxDecoration(
                            color: Colors.white,
                            borderRadius: BorderRadius.circular(4.r),
                            border: Border.all(color: Styles.c_E8EAEF, width: 1.w),
                          ),
                          child: ClipRRect(
                            borderRadius: BorderRadius.circular(3.r),
                            child: Image.asset(
                              'assets/images/ic_login_logo.png',
                              width: 34.w,
                              height: 34.w,
                              fit: BoxFit.contain,
                              package: 'openim_common',
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                  30.verticalSpace,
                  // 过期提示
                  Text(
                    logic.getExpirationText(),
                    style: TextStyle(
                      fontSize: 12.sp,
                      color: Styles.c_8E9AB0,
                    ),
                    textAlign: TextAlign.center,
                  ),
                  40.verticalSpace,
                  // 保存图片按钮
                  Container(
                    width: 120.w,
                    height: 36.h,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(6.r),
                    ),
                    child: TextButton(
                      onPressed: logic.saveQRCodeToLocal,
                      style: TextButton.styleFrom(
                        backgroundColor: Colors.transparent,
                        padding: EdgeInsets.zero,
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(6.r),
                        ),
                      ),
                      child: Text(
                        '保存图片',
                        style: TextStyle(
                          fontSize: 14.sp,
                          color: Colors.blue[800],
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}
